<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<script src="./vue.js"></script>
<body>
<!-- 	
		注意这里的 is="custom-component" 属性。这种做法在使用 DOM 模板时是十分必要的，
		因为在 <ul> 元素内只有 <li> 元素会被看作有效内容。这样做实现的效果与 
		<custom-component> 相同，但是可以避开一些潜在的浏览器解析错误。
	-->
	<div id="app">
		<ul>
			<!-- <li is="custom-component"></li> -->
			<custom-component></custom-component>
		</ul>
	</div>	

<script>

	Vue.component('custom-component',{
		template:'<li>222222</li>'
	})


	var  vm=new Vue({
		el:'#app'
	})



</script>	
</body>
</html>